<template>
        <tab-bar>
            <!-- 首页 -->
            <tab-bar-item path="/home">
              <template v-slot:item-icon>
                <img src="../assets/img/tabbar/home.png" alt="首页">
              </template>
              <template v-slot:item-icon-active>
                  <img src="../assets/img/tabbar/home_active.png" alt="首页活跃">
              </template>
              <template v-slot:item-text>
                <span>首页</span>
              </template>
            </tab-bar-item>
            <!-- 分类 -->
            <tab-bar-item path="/application">
              <template v-slot:item-icon>
                <img src="../assets/img/tabbar/application-two.png" alt="首页">
              </template>
              <template v-slot:item-text>
                <span>首页</span>
              </template>
            </tab-bar-item>
            <!-- 购物车 -->
            <tab-bar-item path="/shopping">
              <template v-slot:item-icon>
                <img src="../assets/img/tabbar/shopping-cart-one.png" alt="首页">
              </template>
              <template v-slot:item-text>
                <span>首页</span>
              </template>
            </tab-bar-item>
            <!-- 我的 -->
            <tab-bar-item path="/me">
              <template v-slot:item-icon>
                <img src="../assets/img/tabbar/me.png" alt="首页">
              </template>
              <template v-slot:item-text>
                <span>首页</span>
              </template>
            </tab-bar-item>
        </tab-bar>
</template>

<script>
    import TabBar from  './TabBar.vue'
    import TabBarItem from './TabBarItem.vue'
    export default {
        name:'MainTabBar',
        components:{
            TabBar,
            TabBarItem
        }
    }
</script>

<style scoped>

</style>